Completed
Pull Request — master (#120)
by Maxence
03:22
created

nav.initElementsCircleNavigation   B

Complexity

Conditions 1
Paths 1

Size

Total Lines 40

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
c 0
b 0
f 0
dl 0
loc 40
rs 8.8571
cc 1
nc 1
nop 0

5 Functions

Rating   Name   Duplication   Size   Complexity  
A 0 4 1
A 0 10 1
A 0 11 1
A 0 3 1
A 0 3 1
1
/*
2
 * Circles - Bring cloud-users closer together.
3
 *
4
 * This file is licensed under the Affero General Public License version 3 or
5
 * later. See the COPYING file.
6
 *
7
 * @author Maxence Lange <[email protected]>
8
 * @copyright 2017
9
 * @license GNU AGPL version 3 or any later version
10
 *
11
 * This program is free software: you can redistribute it and/or modify
12
 * it under the terms of the GNU Affero General Public License as
13
 * published by the Free Software Foundation, either version 3 of the
14
 * License, or (at your option) any later version.
15
 *
16
 * This program is distributed in the hope that it will be useful,
17
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
18
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
19
 * GNU Affero General Public License for more details.
20
 *
21
 * You should have received a copy of the GNU Affero General Public License
22
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
23
 *
24
 */
25
26
/** global: OC */
27
/** global: OCA */
28
/** global: Notyf */
29
30
/** global: actions */
31
/** global: nav */
32
/** global: elements */
33
/** global: settings */
34
/** global: resultCircles */
35
/** global: resultMembers */
36
/** global: resultGroups */
37
/** global: resultLinks */
38
/** global: curr */
39
/** global: api */
40
/** global: define */
41
42
var nav = {
43
44
	initNavigation: function () {
45
		this.initElementsAddMemberNavigation();
46
		this.initElementsLinkCircleNavigation();
47
		this.initElementsCircleNavigation();
48
49
		this.displayCirclesList('all');
50
	},
51
52
53
	initElementsAddMemberNavigation: function () {
54
55
		elements.addMember.hide();
56
		elements.addMember.on('input propertychange paste focus', function () {
57
			var search = $(this).val().trim();
58
			if (search === '') {
59
				elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
60
				return;
61
			}
62
63
			actions.searchMembersRequest(search);
64
			if (elements.membersSearchResult.children().length === 0) {
65
				elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
66
			} else {
67
				elements.membersSearchResult.fadeIn(curr.animationMenuSpeed);
68
			}
69
		}).blur(function () {
70
			setTimeout(function () {
71
				elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
72
				nav.circlesActionReturn();
73
			}, 100);
74
		});
75
		elements.addMember.on('keydown', function (e) {
76
			if (e.keyCode === 27) {
77
				nav.circlesActionReturn();
78
			}
79
			if (e.keyCode === 13) {
80
81
				if (curr.exactMemberSearchType === 'group') {
82
83
					OC.dialogs.confirm(
84
						t('circles',
85
							'This operation will add/invite all members of the group to the circle'),
86
						t('circles', 'Please confirm'),
87
						function (e) {
88
							if (e === true) {
89
								api.addMember(curr.circle, elements.addMember.val(), define.typeGroup,
90
									resultMembers.addMemberResult);
91
							}
92
						});
93
				} else {
94
					if (actions.validateEmail(elements.addMember.val())) {
95
						api.addMember(curr.circle, elements.addMember.val(), define.typeMail,
96
							resultMembers.addMemberResult);
97
					} else {
98
						api.addMember(curr.circle, elements.addMember.val(), define.typeUser,
99
							resultMembers.addMemberResult);
100
					}
101
				}
102
			}
103
		});
104
105
106
		elements.linkGroup.on('input propertychange paste focus', function () {
107
			var search = $(this).val().trim();
108
			if (search === '') {
109
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
110
				return;
111
			}
112
113
			actions.searchGroupsRequest(search);
114
			if (elements.groupsSearchResult.children().length === 0) {
115
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
116
			} else {
117
				elements.groupsSearchResult.fadeIn(curr.animationMenuSpeed);
118
			}
119
		}).blur(function () {
120
			setTimeout(function () {
121
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
122
				nav.circlesActionReturn();
123
			}, 100);
124
		});
125
		elements.linkGroup.on('keydown', function (e) {
126
			if (e.keyCode === 27) {
127
				nav.circlesActionReturn();
128
			}
129
			if (e.keyCode === 13) {
130
				api.linkGroup(curr.circle, $(this).val(), resultGroups.linkGroupResult);
131
			}
132
		});
133
	},
134
135
136
	initElementsLinkCircleNavigation: function () {
137
138
		elements.linkCircle.hide();
139
		elements.linkCircle.on('keydown', function (e) {
140
141
			if (e.keyCode === 27) {
142
				nav.circlesActionReturn();
143
			}
144
			if (e.keyCode !== 13) {
145
				return;
146
			}
147
148
			api.linkCircle(curr.circle, elements.linkCircle.val().trim(),
149
				resultLinks.linkCircleResult);
150
		}).blur(function () {
151
			nav.circlesActionReturn();
152
		});
153
	},
154
155
156
	initElementsCircleNavigation: function () {
157
158
		elements.joinCircle.hide();
159
		elements.joinCircle.on('click', function () {
160
			api.joinCircle(curr.circle, resultCircles.joinCircleResult);
161
			nav.circlesActionReturn();
162
		});
163
164
		elements.leaveCircle.hide();
165
		elements.leaveCircle.on('click', function () {
166
			OC.dialogs.confirm(
167
				t('circles', 'Are you sure you want to leave this circle?'),
168
				t('circles', 'Please confirm'),
169
				function (e) {
170
					if (e === true) {
171
						api.leaveCircle(curr.circle, resultCircles.leaveCircleResult);
172
						nav.circlesActionReturn();
173
					}
174
				});
175
		});
176
177
		elements.destroyCircle.on('click', function () {
178
			OC.dialogs.confirm(
179
				t('circles', 'Are you sure you want to delete this circle?'),
180
				t('circles', 'This action is irreversible'),
181
				function (e) {
182
					if (e === true) {
183
						api.destroyCircle(curr.circle, resultCircles.destroyCircleResult);
184
					}
185
				});
186
		});
187
188
		elements.joinCircleAccept.on('click', function () {
189
			api.joinCircle(curr.circle, resultCircles.joinCircleResult);
190
		});
191
192
		elements.joinCircleReject.on('click', function () {
193
			api.leaveCircle(curr.circle, resultCircles.leaveCircleResult);
194
		});
195
	},
196
197
198
	displayCirclesList: function (type) {
199
200
		curr.circlesType = type;
201
		curr.searchCircle = '';
202
		curr.searchUser = '';
203
204
		curr.circle = 0;
205
		curr.circleLevel = 0;
206
207
		elements.navigation.show('slide', 800);
208
		elements.emptyContent.show(800);
209
		elements.mainUI.fadeOut(800);
210
211
		elements.circlesSearch.val('');
212
		elements.addMember.val('');
213
		elements.linkCircle.val('');
214
215
		this.resetCirclesTypeSelection(type);
216
		elements.resetCirclesList();
217
		api.listCircles(type, '', curr.searchFilter, resultCircles.listCirclesResult);
218
	},
219
220
221
	resetCirclesTypeSelection: function (type) {
222
		elements.circlesList.children('div').removeClass('selected');
223
		elements.circlesList.children().each(function () {
224
			if ($(this).attr('circle-type') === type.toLowerCase()) {
225
				$(this).addClass('selected');
226
			}
227
		});
228
	},
229
230
	circlesActionReturn: function () {
231
		nav.displayCircleButtons(true);
232
		settings.displaySettings(false);
233
		nav.displayAddMemberInput(false);
234
		nav.displayLinkGroupInput(false);
235
		nav.displayLinkCircleInput(false);
236
		nav.displayJoinCircleButton(false);
237
		nav.displayInviteCircleButtons(false);
238
	},
239
240
	joinCircleAction: function () {
241
		nav.displayCircleButtons(false);
242
		nav.displayAddMemberInput(false);
243
		nav.displayLinkCircleInput(false);
244
		nav.displayLinkGroupInput(false);
245
		nav.displayJoinCircleButton(true);
246
	},
247
248
	displayCircleButtons: function (display) {
249
		if (display) {
250
			elements.buttonCircleActionReturn.hide(define.animationMenuSpeed);
251
			elements.buttonCircleActions.delay(define.animationMenuSpeed).show(
252
				define.animationMenuSpeed);
253
		} else {
254
			elements.buttonCircleActions.hide(define.animationMenuSpeed);
255
			elements.buttonCircleActionReturn.delay(define.animationMenuSpeed).show(
256
				define.animationMenuSpeed);
257
		}
258
	},
259
260
	displayAddMemberInput: function (display) {
261
		if (display) {
262
			elements.addMember.val('');
263
			elements.addMember.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
264
				function () {
265
					$(this).focus();
266
				});
267
		} else {
268
			elements.addMember.hide(define.animationMenuSpeed);
269
		}
270
	},
271
272
	displayLinkGroupInput: function (display) {
273
		if (display) {
274
			elements.linkGroup.val('');
275
			elements.linkGroup.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
276
				function () {
277
					$(this).focus();
278
				});
279
		} else {
280
			elements.linkGroup.hide(define.animationMenuSpeed);
281
		}
282
	},
283
284
	displayLinkCircleInput: function (display) {
285
		if (display) {
286
			elements.linkCircle.val('');
287
			elements.linkCircle.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
288
				function () {
289
					$(this).focus();
290
				});
291
		} else {
292
			elements.linkCircle.hide(define.animationMenuSpeed);
293
		}
294
	},
295
296
297
	displayInviteCircleButtons: function (display) {
298
		if (display) {
299
			elements.joinCircleAccept.show(define.animationMenuSpeed);
300
			elements.joinCircleReject.delay(define.animationMenuSpeed).show(
301
				define.animationMenuSpeed);
302
		} else {
303
			elements.joinCircleAccept.hide(define.animationMenuSpeed);
304
			elements.joinCircleReject.hide(define.animationMenuSpeed);
305
		}
306
	},
307
308
	displayJoinCircleButton: function (display) {
309
		if (display) {
310
			if (curr.circleStatus === 'Invited') {
311
				elements.joinCircle.hide(define.animationMenuSpeed);
312
				elements.leaveCircle.hide(define.animationMenuSpeed);
313
				nav.displayInviteCircleButtons(true);
314
315
			} else {
316
				nav.displayInviteCircleButtons(false);
317
318
				if (curr.circleDetails.user.level === 0 && curr.circleStatus !== 'Requesting') {
319
					elements.joinCircle.delay(define.animationMenuSpeed).show(
320
						define.animationMenuSpeed);
321
					elements.leaveCircle.hide(define.animationMenuSpeed);
322
					elements.joinCircleAccept.hide(define.animationMenuSpeed);
323
					elements.joinCircleReject.hide(define.animationMenuSpeed);
324
325
				}
326
				else {
327
					elements.leaveCircle.delay(define.animationMenuSpeed).show(
328
						define.animationMenuSpeed);
329
					elements.joinCircle.hide(define.animationMenuSpeed);
330
				}
331
			}
332
		} else {
333
			elements.joinCircle.hide(define.animationMenuSpeed);
334
			elements.leaveCircle.hide(define.animationMenuSpeed);
335
		}
336
	},
337
338
339
	/**
340
	 *
341
	 * @param display
342
	 */
343
	displayOptionsNewCircle: function (display) {
344
		if (display) {
345
			elements.newType.fadeIn(300);
346
			elements.newSubmit.fadeIn(500);
347
			elements.newTypeDefinition.fadeIn(700);
348
		}
349
		else {
350
			elements.newType.fadeOut(700);
351
			elements.newSubmit.fadeOut(500);
352
			elements.newTypeDefinition.fadeOut(300);
353
		}
354
	},
355
356
357
	displayMembers: function (members) {
358
		if (members === '') {
359
			members = curr.circleMembers;
360
		} else {
361
			curr.circleMembers = members;
362
		}
363
364
		elements.mainUIMembersTable.emptyTable();
365
		if (members === null) {
366
			elements.mainUIMembersTable.hide(200);
367
			return;
368
		}
369
370
		elements.mainUIMembersTable.show(200);
371
		for (var i = 0; i < members.length; i++) {
372
			var tmpl = elements.generateTmplMember(members[i]);
373
			elements.mainUIMembersTable.append(tmpl);
374
		}
375
376
		for (i = 0; i < 10; i++) {
377
			if (curr.circleLevel < 9 && curr.circleLevel <= i
378
				|| curr.circleDetails.type === define.typePersonal) {
0 ignored issues
show
Bug introduced by
There seems to be a bad line break before ||.
Loading history...
379
				$('.level-select option[value="' + i + '"]').attr('disabled', 'disabled');
380
			}
381
		}
382
383
384
		elements.mainUIMembersTable.children('tr.entry').each(function () {
385
386
				var userId = $(this).attr('member-id');
387
				var userType = Number($(this).attr('member-type'));
388
389
				if (userId === curr.userId && userType === define.typeUser) {
390
					$(this).find('td.username').css('font-weight', 'bold').css('font-style', 'italic');
391
					$(this).css('background', '#e0e0e0');
392
				} else {
393
					$(this).css('background', '#fff');
394
				}
395
396
				//
397
				// level
398
				if (curr.circleDetails.type === define.typePersonal) {
399
					var levelString = $(this).attr('member-levelString');
400
					$(this).find('.level').text(levelString);
401
				} else {
402
					var level = Number($(this).attr('member-level'));
403
					var levelSelect = $(this).find('.level-select');
404
					if (level === 0) {
405
						levelSelect.hide();
406
					}
407
					else {
408
						levelSelect.show(200).val(level);
409
					}
410
					levelSelect.on('change', function () {
411
						actions.changeMemberLevel(userId, userType, $(this).val());
412
					});
413
				}
414
415
				//
416
				// status
417
				var status = $(this).attr('member-status');
418
				var statusSelect = $(this).find('.status-select');
419
420
				statusSelect.on('change', function () {
421
					actions.changeMemberStatus(userId, userType, $(this).val());
422
				});
423
				if (userType === define.typeUser) {
424
					statusSelect.append($('<option>', {
425
						value: status,
426
						text: t('circles', status)
427
					})).val(status);
428
				}
429
430
				if (userType === define.typeMail) {
431
					statusSelect.append($('<option>', {
432
						value: status,
433
						text: t('circles', 'Mail Address')
434
					})).val(status);
435
				}
436
437
				if (userType === define.typeContact) {
438
					statusSelect.append($('<option>', {
439
						value: status,
440
						text: t('circles', 'Contact')
441
					})).val(status);
442
				}
443
444
				if (curr.circleLevel <= $(this).attr('member-level')) {
445
					return;
446
				}
447
448
				if (status === 'Member' || status === 'Invited') {
449
					statusSelect.append($('<option>', {
450
						value: 'remove_member',
451
						text: t('circles', 'Kick this member')
452
					}));
453
				}
454
455
				if (status === 'Requesting') {
456
					statusSelect.append($('<option>', {
457
						value: 'accept_request',
458
						text: t('circles', 'Accept the request')
459
					}));
460
					statusSelect.append($('<option>', {
461
						value: 'dismiss_request',
462
						text: t('circles', 'Dismiss the request')
463
					}));
464
				}
465
466
			}
467
		);
468
	},
469
470
471
	displayGroups: function (groups) {
472
		if (groups === '') {
473
			groups = curr.circleGroups;
474
		} else {
475
			curr.circleGroups = groups;
476
		}
477
478
		if (groups === null || groups.length === 0) {
479
			elements.mainUIGroupsTable.hide(curr.animationSpeed);
480
			return;
481
		}
482
483
		elements.mainUIGroupsTable.emptyTable();
484
		elements.mainUIGroupsTable.show(200);
485
		for (var i = 0; i < groups.length; i++) {
486
			var tmpl = elements.generateTmplGroup(groups[i]);
487
			elements.mainUIGroupsTable.append(tmpl);
488
		}
489
490
		for (i = 0; i < 10; i++) {
491
			if (curr.circleLevel < 9 && curr.circleLevel <= i) {
492
				$('.level-select option[value="' + i + '"]').attr('disabled', 'disabled');
493
			}
494
			if (i > define.levelMember && curr.circleDetails.type === define.typePersonal) {
495
				$('.level-select option[value="' + i + '"]').remove();
496
			}
497
		}
498
499
		elements.mainUIGroupsTable.children('tr.entry').each(function () {
500
501
				var groupId = $(this).attr('group-id');
502
				if (curr.circleDetails.group !== null &&
503
					groupId === curr.circleDetails.group.user_id) {
504
					$(this).find('td.username').css('font-weight', 'bold').css('font-style', 'italic');
505
					$(this).css('background', '#e0e0e0');
506
				} else {
507
					$(this).css('background', '#fff');
508
				}
509
510
				var level = Number($(this).attr('group-level'));
511
				var levelSelect = $(this).find('.level-select');
512
				if (level === 0) {
513
					levelSelect.hide();
514
				}
515
				else {
516
					levelSelect.show(200).val(level);
517
				}
518
				levelSelect.append($('<option>', {
519
					value: 'remove_group',
520
					text: t('circles', 'Unlink this group')
521
				}));
522
523
				levelSelect.on('change', function () {
524
					actions.changeGroupLevel(groupId, $(this).val());
525
				});
526
			}
527
		);
528
	},
529
530
531
	displayLinks: function (links) {
532
533
		if (links === '') {
534
			links = curr.circleLinks;
535
		} else {
536
			curr.circleLinks = links;
537
		}
538
539
		elements.mainUILinksTable.hide(curr.animationSpeed);
540
		elements.mainUILinksTable.emptyTable();
541
		if (links === null || links.length === 0) {
542
			return;
543
		}
544
545
		elements.mainUILinksTable.show(curr.animationSpeed);
546
		for (var i = 0; i < links.length; i++) {
547
			var tmpl = elements.generateTmplLink(links[i]);
548
			elements.mainUILinksTable.append(tmpl);
549
		}
550
551
552
		elements.mainUILinksTable.children('tr.entry').each(function () {
553
554
			var linkId = $(this).attr('link-id');
555
			var status = parseInt($(this).attr('link-status'));
556
557
558
			var statusSelect = $(this).find('.link-status-select');
559
560
			statusSelect.on('change', function () {
561
				actions.changeLinkStatus(linkId, $(this).val());
562
			});
563
			statusSelect.append($('<option>', {
564
				value: status,
565
				text: define.linkStatus(status)
566
			})).val(status);
567
568
			if (curr.circleLevel < define.levelAdmin) {
569
				return;
570
			}
571
572
			if (status === define.linkSetup || status === define.linkRefused ||
573
				status === define.linkUp || status === define.linkDown) {
574
				statusSelect.append($('<option>', {
575
					value: define.linkRemove,
576
					text: t('circles', 'Remove this link')
577
				}));
578
			}
579
580
			if (status === define.linkRequestSent) {
581
				statusSelect.append($('<option>', {
582
					value: define.linkRemove,
583
					text: t('circles', 'Cancel the link request')
584
				}));
585
			}
586
587
			if (status === define.linkRequested) {
588
				statusSelect.append($('<option>', {
589
					value: define.linkUp,
590
					text: t('circles', 'Accept the link request')
591
				}));
592
				statusSelect.append($('<option>', {
593
					value: define.linkRemove,
594
					text: t('circles', 'Reject the link request')
595
				}));
596
			}
597
		});
598
	},
599
600
601
	displayCircleDetails: function (details) {
602
		elements.circleDetails.children('#name').text(details.name);
603
		elements.circleDesc.text(details.description);
604
605
		elements.circleDetails.children('#type').text(t('circles', details.type_long_string));
606
		if (details.description !== '') {
607
			elements.circleDesc.html(
608
				escapeHTML(details.description).replace(/\n/g, '&nbsp;<br />')).show(
609
				define.animationSpeed);
610
		}
611
		else {
612
			elements.circleDesc.text('').hide(define.animationSpeed);
613
		}
614
615
		elements.buttonCircleActions.show(300);
616
		elements.addMember.hide(300);
617
	},
618
619
620
	displayMembersInteraction: function (details) {
621
		if (details.viewer.level < define.levelModerator) {
622
			elements.buttonAddMember.hide();
623
		} else {
624
			elements.buttonAddMember.show();
625
		}
626
627
		nav.displayMemberInteractionCircleLinks(details);
628
		nav.displayMemberInteractionGroupLinks(details);
629
630
		elements.joinCircleInteraction.hide();
631
		elements.buttonJoinCircle.show();
632
633
		this.displayNonMemberInteraction(details);
634
635
		if (details.viewer.level === define.levelOwner) {
636
			elements.destroyCircle.show();
637
			elements.buttonCircleSettings.show();
638
			elements.buttonJoinCircle.hide();
639
		}
640
	},
641
642
643
	displayMemberInteractionGroupLinks: function (details) {
644
		if (curr.allowed_linked_groups === '0' ||
645
			details.viewer.level < define.levelAdmin
646
		) {
647
			elements.buttonLinkGroup.hide();
648
		}
649
		else {
650
			elements.buttonLinkGroup.show();
651
		}
652
	},
653
654
655
	displayMemberInteractionCircleLinks: function (details) {
656
		if (curr.allowed_federated_circles === '0' ||
657
			curr.circleSettings['allow_links'] !== 'true' ||
0 ignored issues
show
Coding Style introduced by
['allow_links'] could be written in dot notation.

You can rewrite this statement in dot notation:

var obj = { };
obj['foo'] = 'bar'; // Bad
obj.foo = 'bar'; // Good
Loading history...
658
			details.type === define.typePersonal ||
659
			details.viewer.level < define.levelAdmin
660
		) {
661
			elements.buttonLinkCircle.hide();
662
		}
663
		else {
664
			elements.buttonLinkCircle.show();
665
		}
666
	},
667
668
669
	displayNonMemberInteraction: function (details) {
670
		elements.joinCircleAccept.hide();
671
		elements.joinCircleReject.hide();
672
		elements.joinCircleRequest.hide();
673
		elements.joinCircleInvite.hide();
674
		elements.buttonCircleSettings.hide();
675
		elements.destroyCircle.hide();
676
677
		if (details.user.status === 'Requesting') {
678
			elements.joinCircleRequest.show();
679
			return;
680
		}
681
682
		if (details.user.status === 'Invited') {
683
			elements.joinCircleInvite.show();
684
			return;
685
		}
686
687
		if (details.viewer.level > 0) {
688
			return;
689
		}
690
691
		setTimeout(function () {
692
			nav.joinCircleAction();
693
		}, 200);
694
	}
695
696
};
697
698